<template>
	<!-- <view class="main-class"> -->
	<z-paging ref="paging" v-model="noticeDate" @query="queryList" >
		<template #top>	
			<tn-sticky>
				<view class="header-class tn-flex justify-end tn-pb-lg" >
					<view class="status_bar" style="height: var(--status-bar-height); width: 100%; "></view>			
					<tn-navbar height="45px" home-icon="" :bottom-shadow = "false" bg-color="tn-type-primary_bg" text-color="tn-white" > 我的公告 </tn-navbar>
				</view>
			</tn-sticky>
		</template>
	
		<view class="tn-pl tn-pr tn-radius tn-pb">
			<view class="" v-for="(item,index) in noticeDate" >
				<view class="tn-pl-sm tn-pt-sm tn-pt-sm tn-text-lg">
					{{item.noticetitle}}
				</view>
				<view class="tn-pl-sm tn-pt-sm tn-pb-sm tn-text-sm tn-grey_text">
					<view class="" v-html="item.noticecont"></view>
				</view>
				<hr/>
			</view>
		</view>
	</z-paging>	
</template>

<script setup>
	import { ref,reactive,onMounted,nextTick  } from 'vue'
	import { postCall  } from '@/api/index.js'
	import { toastMessage } from '@/utils/toast.js'
	import { createParams } from '@/utils/utils.js'
	const procName = "PROC_APP_DO_NOTICE";
	const paging = ref(null)
	
	const noticeDate = ref([]);
	
	let pageInfo = {
		P_PAGE : 1 ,
		P_PAGESIZE : 10
	}
	
	const queryList = (pageNo, pageSize) =>{
		pageInfo.P_PAGE = pageNo;
		pageInfo.P_PAGESIZE = pageSize;
		let params = {};
		params["P_PROC_NAME"] = procName;
		params["P_ACTION"] = "TITLLIST";
		postCall(Object.assign(params,pageInfo)).then(res=>{
			if(res){
				if(res.code===200 || res.code===1000){
					paging.value.complete(res.data.DATASET);
				}
			}
		  
		}).catch(res =>{
			paging.value.complete(false);
		})
	}
	
</script>

<style scoped>
.header-class{
	height: 17vh !important;
	flex-direction: column
}
.form-class{
	width: 90vw;
	margin-left: 5vw;
}
.button-class{
	margin-top: 5vh;
	width: 90vw;
	border-radius: 40px !important;
	/* color: #FFFFFF !important; */
	background: linear-gradient(to right,  #47e8be,#3379dc);
	/* border: 0px solid rgba(0, 0, 0, 0.2) !important; */
}

.button-class::after{
	border: 0px solid rgba(0, 0, 0, 0.2) !important;
}

.popup-calendar-button {
  margin: 0rpx 30rpx;
  width: calc(100% - 60rpx) !important;
  padding: 20rpx 30rpx !important;
}

.no-data-class{
	
	display: flex;
	justify-content: center;
	align-items: center;
	padding-top: 10vh;
}
</style>
